<?php
// registrar scripts y css
add_action('admin_enqueue_scripts', 'registrar_producto_css_js', 10, 1);

function registrar_producto_css_js($hook) {

    if ($hook == 'parametros_page_productos') {
        wp_enqueue_script('productos-js', get_template_directory_uri() . '/js/parametros/productos.js');
        wp_enqueue_style('formularios-css', get_template_directory_uri() . '/css/formularios.css');

        //estas son variables que puedo usar en los scripts
        wp_localize_script('productos-js', 'ajax_object', array('ajax_url' => admin_url('admin-ajax.php')));
    }
}

add_action('wp_ajax_guardar_producto', 'guardar_producto_ajax');

function guardar_producto_ajax() {
    global $wpdb;

//    SI TODO ES CORRECTO GUARDAMOS LOS CAMPOS
    if ($_POST['estado'] == 'true') {
        $estado = 1;
    } else {
        $estado = 0;
    }

    if ($_POST['id_producto'] != '') {
        $producto = array(
            'nombre' => $_POST['nombre'],
            'detalle' => $_POST['detalle'],
            'link' => $_POST['link'],
            'estado' => $estado
        );
        $wpdb->update(productos, $producto, array('id_producto' => $_POST['id_producto']));
    } else {


        $producto = array(
            'nombre' => $_POST['nombre'],
            'detalle' => $_POST['detalle'],
            'link' => $_POST['link'],
            'estado' => $estado
        );
        $wpdb->insert(productos, $producto);
    }

    mostrar_tabla_productos();

    die();
}

add_action('wp_ajax_eliminar_producto', 'eliminar_producto_ajax');

function eliminar_producto_ajax() {
    global $wpdb;

    $wpdb->query("DELETE FROM productos WHERE id_producto = " . $_POST['id_producto']);

    mostrar_tabla_productos();

    die();
}

//FUNCION QUE SE EJECUTA AL INGRESAR POR PRIMERA VEZ AL FORMULARIO
function mostrar_productos() {
    ?>

    <div style="position: relative;">
        <div class="wrap" style="box-shadow: 0 0 2px 0 black; display: inline-block; margin: 10px; padding: 10px 80px 40px;">
            <?php mostrar_fomulario_productos(); ?>

            <div class="listado-productos">
                <div class = "icon32 icon32-bws" id = "icon-options-general"></div>
                <h2>Listado de Productos</h2>
                <br/>
                <div class="lista" >
                    <?php mostrar_tabla_productos(); ?>
                </div>

                <br/>
                <label class="agregar button-primary">+ Agregar</label>
                <br/><br/>
            </div>
        </div>
    </div>
    <?php
}

function mostrar_fomulario_productos() {
    ?>
    <div id = "popup">
        <div class="close"></div>
        <div id="alta-producto">

            <div class="icon32" id="icon-options-general"></div>
            <h2>Producto</h2>

            <br/>
            <form method="post" action="admin.php?page=productos">
                <table>
                    <tr>
                        <td>ID:</td><td><input class="id_producto" type="text" size="6" disabled style="text-align: center; background-color: #F2F2F2;"/></td>
                    </tr>
                    <tr>
                        <td>Nombre:</td><td><input class="nombre" type="text" size="50" /></td>
                    </tr>
                    <tr>
                        <td>Detalle:</td><td><textarea class="detalle" rows="3" cols="47" ></textarea></td>
                    </tr>
                    <tr>
                        <td>Link:</td><td><input class="link" type="text" size="50" /></td>
                    </tr>
                    <tr>
                        <td>Estado:</td><td><input class="estado" type="checkbox" checked/></td>
                    </tr>
                </table>

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    <!-- <input type="hidden" name="producto_submit" value="submit" />-->
                <p class="submit">
                    <input type="button" name="guardar" class="guardar button-primary" value="Guardar" />
                    <input type="button" name="cancelar" class="cancelar button-primary" value="Cancelar" />
                </p>
            </form>


        </div>
    </div>
    <div id="backgroundPopup"></div><?php
}

function mostrar_tabla_productos() {
    global $wpdb;
    //$productos = get_option('productos');

    $productos = $wpdb->get_results("SELECT * FROM productos ORDER BY id_producto DESC");

//    echo '<pre>';
//    print_r($productos);
//    echo '</pre>';
    ?>

    <table class="tabla-productos">
        <tr>
            <th style="width: 30px; text-align: center;">Nº</th>
            <th style="width: 30px; text-align: center;">ID</th>
            <th style="width: 250px;">Nombre</th>
            <th style="width: 300px;">Detalle</th>
            <th style="width: 200px;">Link</th>
            <th style="width: 50px;">Estado</th>
        </tr>
        <?php
        $i = 1;
        ?>
        <?php foreach ($productos as $producto) { ?>
            <tr>
                <td class="t-nro" style="text-align: center;"><?php echo $i; ?></td>
                <td class="t-id" style="text-align: center;"><?php echo $producto->id_producto; ?></td>
                <td class="t-nombre"><?php echo $producto->nombre; ?></td>
                <td class="t-detalle"><?php echo $producto->detalle; ?></td>
                <td class="t-link"><?php echo $producto->link; ?></td>
                <td class="t-estado" style="text-align: center;"><?php
        if ($producto->estado == 1) {
            echo 'Activo';
        } else {
            echo 'Inactivo';
        }
            ?>
                    <input class="t-estado" type="hidden" name="estado" value="<?php echo $producto->estado; ?>"/></td>
                <td><label class="modificar" ></label><input id="M-<?php echo $producto->id_producto; ?>" type="hidden" value="<?php echo $producto->id_producto; ?>" style="display: none;"/></td>
                <td><label class="eliminar" ></label><input id="E-<?php echo $producto->id_producto; ?>" type="hidden" value="<?php echo $producto->id_producto; ?>" style="display: none;"/></td>
            </tr>

            <?php
            $i++;
        }
        ?>
        <div class="cargando" style="display: none; z-index: 999;"><img src="<?php bloginfo('template_url'); ?>/images/loader.gif" alt="mensaje loader"/></div>
    </table>


    <script type="text/javascript">
        jQuery("label.eliminar").click(function() {
            if (confirm('¿Esta seguro que desea eliminar este producto?')) {
                //AJAX
                var data = {//estos son los datos que paso por $_POST
                    action: 'eliminar_producto',
                    id_producto: jQuery(this).parent().find('input').val()
                };

                jQuery.ajax({
                    type: "POST",
                    url: ajax_object.ajax_url,
                    data: data,
                    beforeSend: function() {
                        cargando();
                    },
                    success: function(datos) {
                        //                alert(datos);
                        jQuery('.lista').html(datos);
                    },
                    timeout: 4000,
                    error: function() {
                        alert('No se ha podido establecer la conexión con el servidor.');
                        jQuery('.cargando').fadeOut();

                    }
                });
            }
        });

        jQuery("label.modificar").click(function() {
            loadPopup(); // function show popup

            jQuery('.id_producto').val(jQuery(this).parent().find('input').val());
            jQuery('.nombre').val(jQuery(this).parent().parent().find('.t-nombre').text());
            jQuery('.detalle').val(jQuery(this).parent().parent().find('.t-detalle').text());
            jQuery('.link').val(jQuery(this).parent().parent().find('.t-link').text());

            var check;
            if (jQuery(this).parent().parent().find('input.t-estado').val() == 1) {
                check = true;
            } else {
                check = false;
            }
            jQuery('.estado').attr('checked', check);

        });

        function loadPopup() {
            jQuery("#popup").fadeIn(0500); // fadein popup div
            jQuery("#backgroundPopup").fadeIn(0001);

        }

        function cargando() {

            var w, h; //varibles width y height
            w = jQuery('.tabla-productos').width();
            h = jQuery('.tabla-productos').height() - 21;
            //            alert(w+' || '+h);
            jQuery('.cargando').css({width: w, height: h, 'line-height': (h + 9) + 'px'});
            jQuery('.cargando').fadeIn();
        }


    </script>
<?php }
?>
